<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>订单发货</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" th:href="@{/css/font.css}">
        <link rel="stylesheet" th:href="@{/css/xadmin.css}">
        <link rel="stylesheet" th:href="@{/lib/rep/bootstrap-3.3.7-dist/css/bootstrap.css}">
        <link rel="stylesheet" th:href="@{/lib/webuploader/0.1.5/webuploader.css}">
        <script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
        <script type="text/javascript" th:src="@{/js/xadmin.js}"></script>
        <!--[if lt IE 9]>
          <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
          <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
        <style>
            .layui-form-item div label{
                float: right;
                width: unset;
            }
            .layui-form-item div {
                font-size: 15px;
            }
            .error{
                color: red;
            }
            .layui-form-item div input{
                border-color: #ddd;
            }
            .layui-form-select{
                width: fit-content;
            }
        </style>
    </head>
    <body>
    <div class="page-container">
        <form class="layui-form" name="list-edit" action="" method="post" id="list-edit">
            <div class="layui-form-item layui-row">
                <div class="layui-col-md2">
                    <label class="layui-form-label"><span class="x-red">*</span>订单号：</label>
                </div>
                <div class="layui-col-md8">
                    <input type="text" class="layui-input" th:value="${oid}" placeholder="" id="oid" name="oid" readonly="readonly" style="height: 40px">
                </div>
            </div>

            <div class="layui-form-item layui-row">
                <div class="layui-col-md2">
                    <label class="layui-form-label"><span class="x-red">*</span>用户账号名：</label>
                </div>
                <div class="layui-col-md8">
                    <input type="text" class="layui-input" value="" placeholder="" id="uid" name="uid" readonly="readonly" style="height: 40px">
                </div>
            </div>

            <div class="layui-form-item layui-row">
                <div class="layui-col-md2">
                    <label class="layui-form-label"><span class="x-red">*</span>物流名称：</label>
                </div>
                <div class="layui-col-md8">
                    <input type="hidden" name="lname" id="lname" value="" lay-verify="required">
                    <select name="modules" lay-verify="required" lay-search="" id="lnames">
<!--                        <option value="0">直接选择或搜索选择</option>-->
                    </select>
                </div>
            </div>

            <div class="layui-form-item layui-row">
                <div class="layui-col-md2">
                    <label class="layui-form-label"><span class="x-red">*</span>物流单号：</label>
                </div>
                <div class="layui-col-md8">
                    <input type="text" class="layui-input" value="" placeholder="请输入物流单号" id="rid" name="rid" lay-verify="required" style="height: 40px;width: 50%;display: unset">
                </div>
            </div>

            <div class="layui-form-item layui-row">
                <div class="layui-col-md8 layui-col-md-offset2">
                    <button id="saveButton" class="btn btn-primary radius" lay-submit=""><i class="layui-icon layui-icon-file"></i> 确认发货</button>
                    <button onClick="layer_close();" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
                </div>
            </div>

        </form>
    </div>
    <script type="text/javascript" th:src="@{/js/commons.js}"></script>
    <script type="text/javascript" th:src="@{/lib/rep/jquery-2.1.1/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jquery.form/jquery-form.js}"></script>
    <script type="text/javascript" th:src="@{/lib/layui/lay/modules/layer.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jquery.validation/1.14.0/validate-methods.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jquery.validation/1.14.0/jquery.validate.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jquery.validation/1.14.0/messages_zh.js}"></script>
    <script>
        let form;
        //加载layui的form模块
        layui.use('form',function () {
            form = layui.form;
            //监听并获取下拉列表的选择数据，回调函数callback即可获取data
            form.on('select',function (data) {
                $('#lname').val(data.value);
            });
            let id = $('#oid').val();
            if (id != null){
                $.ajax({
                    type: 'post',
                    url: '/order/logistics/info',
                    data: {oid:id},
                    success: function (result) {
                        set_select(result);//设置下拉列表内容
                        form.render();
                    }
                });
            }
        });
        //设置内容
        function set_select(obj) {
            if (obj.data == null) layer.alert("数据获取失败",{title:"错误信息",icon: 2});
            else {
                $('#uid').val(obj.data.uid);
                let elem = $('#lnames');
                //清空选择框缓存的数据
                elem.length = 1;
                let data = obj.data;
                let html = '<option value="">直接选择或搜索选择</option>';
                for (let i = 0; i < data.lnames.length; i ++){
                    html += '<option value="' + data.lnames[i] +'">' + data.lnames[i] + '</option>';
                }
                elem.html(html);
            }
        }

        //关闭弹出层
        function layer_close(){
            let index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);
        }

        //保存发布
        $("#list-edit").validate({
            onkeyup:false,
            focusCleanup:false,
            success:"valid",
            submitHandler:function(form){
                let index = layer.load(3);
                $(form).ajaxSubmit({
                    url: "/order/deliver",//接口路径
                    type: "POST",
                    success: function(data) {
                        let r_icon = icon(data);
                        if (data.type == 'forbidden'){
                            layer.alert(data.content,{icon:r_icon},function () {
                                layer.close(layer.index);
                                layer.closeAll('loading');
                            });
                        }else {
                            table = parent.layui.table;
                            table.reload('listTest');
                            layer.confirm(data.content, {
                                btn: ['确认'],icon: 1
                            }, function(){
                                let index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index);
                            });
                        }
                    },
                    error:function(XMLHttpRequest) {
                        layer.close(index);
                        layer.alert('数据处理失败! 错误码:'+XMLHttpRequest.status,{title: '错误信息',icon: 2});
                    }
                });
            }
        });
    </script>
</body>
</html>